<template>
    <div class="binding-box">
        <div class="binding-return">
            <i @click="playbindingreturn()" class=" bindingticon iconfont icon-jiantou"></i>
            <span>支付宝绑定</span>
        </div>
        <div class="binding-list">
            <p>真实姓名</p>
            <div class="binding-list-box">
                <van-field v-model="usename" placeholder="请输入真实姓名">
                </van-field>
            </div>
        </div>
        <div class="binding-list">
            <p>支付宝账号</p>
            <div class="binding-list-box">
                <van-field v-model="alipayAccount" placeholder="请输入支付宝账号">
                </van-field>
            </div>
        </div>
        <!-- <div class="binding-list">
            <p>手机号码</p>
            <div class="binding-list-box">
                <van-field v-model="formdata.usename" placeholder="请输入手机号码">
                </van-field>
            </div>
        </div>
        <div class="binding-list">
            <p>验证码</p>
            <div class="binding-list-box">
                <van-field style="width:50%" v-model="formdata.usename" required placeholder="请输入验证码"></van-field><h1 @click="userpassword"  v-show="gain">获取验证码</h1><h1  v-show="!gain" style="color: #cccccc">{{timereturn}}s重新获取验证码</h1>
            </div>
        </div> -->


       <div @click="subData" class="binding-box-btn">确认</div>
    </div>
</template>

<script>
    import { Toast } from 'vant';  
    export default {
        name: "playbinding.vue",
        data(){
            return{
                usename:"",
                play:"",
                gain:true,
                timereturn:60,
                userId:""
            }
        },        
        mounted(){
            this.userId = localStorage.getItem('user_id');
        },
        methods:{
            playbindingreturn(){
                this.$router.go(-1);
            },
            subData(){
                if(!this.usename){
                    Toast('请输入真实姓名')
                    return
                } 
                if(!this.alipayAccount){
                    Toast('请输入支付宝账号')
                    return
                }                
                this.$http.post(this.utils.config + "/netmall/app/person/api/cashAlipayBinding?userId="+this.userId+"&realName="+this.usename+"&alipayAccount="+this.alipayAccount).then((data) => {
                    if (data.data.success) {
                        Toast(data.data.message);
                        this.$router.go(-1);
                    }
                })
            },
           //获取验证码
            // userpassword(){
            //    this.gain=false;
            //     var setTime = setInterval(()=>{
            //         if(this.timereturn === 1){
            //             clearInterval(setTime);
            //             this.gain = true;
            //         }else{
            //             this.timereturn--
            //         }
            //     },1000)
            // },

        },
    }
</script>

<style scoped>
    @import "../../assets/font/iconfont.css";
    .binding-box{
        padding: 0 14px 0 14px;
        background: rgba(255, 255, 255, 1);
        min-height: 100%;
    }
    .binding-return{
        width: 100%;
        padding: 12px 0 0 0;
        height: 56px;
        text-align: center;
        position: relative;
    }
    .binding-return span{
        margin-top: 12px;
        font-size: 16px;
        font-family: PingFangSC-Semibold, PingFang SC;
        font-weight: 600;
        color: rgba(51, 51, 51, 1);
        line-height: 22px;
    }
    .bindingticon{
        font-size: 18px;
        color: #000000;
        font-weight: 900;
        position: absolute;
        left: 0;
    }
    .binding-list{
        height: 97px;
        width: 100%;
        overflow: hidden;
    }
    .binding-list p{
        padding-left: 10px;
        margin-top: 33px ;
        font-size:12px;
        font-family:SourceHanSansSC-Medium,SourceHanSansSC;
        font-weight:500;
        color:rgba(136,136,136,1);
        line-height:18px;
    }
    .binding-list-box{
        position: relative;
        height: 46px;
        width: 100%;
        border-bottom: 1px solid #EDEDED;
    }
    h1{
        font-size:14px;
        font-family:SourceHanSansSC-Regular,SourceHanSansSC;
        font-weight:400;
        color:rgba(255,46,103,1);
        line-height:20px;
        position: absolute;
        right: 0;
        top:12px;
    }
   .binding-box-btn{
       position: fixed;
       bottom: 11px;
       left: 14px  ;
       right: 14px;
       height:45px;
       background:linear-gradient(90deg,rgba(255,90,160,1) 0%,rgba(255,46,103,1) 100%);
       border-radius:4px;
       font-size:16px;
       font-family:PingFangSC-Regular,PingFang SC;
       font-weight:400;
       color:rgba(255,255,255,1);
       line-height:45px;
       text-align: center;
   }
</style>
